{% extends "base.html" %}
{% load event_tags %}
{% load display_tags %}
{% load static %}
{% block add_css %}
    {{ block.super }}

    <link rel="stylesheet" href="{% static "easymde/dist/easymde.min.css" %}">
{% endblock %}
{% block add_styles %}
    {{ block.super }}
    .chosen-container {
    width: 70% !important;
    }
    .editor-toolbar, .editor-statusbar, .editor-preview-side, .CodeMirror {
    width: 70% !important;
    }
{% endblock %}
{% block content %}
    {{ block.super }}
    <div>
        <h3> Add Findings to a Test</h3>
    </div>
    <div>
        {% if temp %}
            <form id="add_finding" class="form-horizontal" action="{% url 'add_temp_finding' tid fid %}" method="post">
                {% csrf_token %}
                {% include "dojo/form_fields.html" with form=form %}
                {% if jform %}
                    <h4> JIRA </h4>
                    <h4>
                    <div class="form-group">
                        <label class="col-sm-2 control-label" for="id_jira_issue">JIRA URL
                            <i class="fa-solid fa-circle-question has-popover" data-trigger="hover" data-content="JIRA URL connected to this findings product or engagement" data-placement="right" data-container="body" data-original-title="" title="">
                            </i>
                        </label>
                        <div class="col-sm-10 form-control-static">
                            {% if product_tab.product.has_jira_configured %}
                                <a href="{{ product_tab.product|jira_project_url }}"
                                target="_blank"> {{ product_tab.product|jira_project_url }} </a>
                            {% else %}
                            None
                            {% endif %}
                        </div>
                    </div>

                    {% include "dojo/form_fields.html" with form=jform %}
                {% endif %}
                <div class="form-group">
                    <div class="col-sm-offset-2 col-sm-10">
                        <input class="btn btn-primary" type="submit" value="Add Another Finding"/>
                        <input class="btn btn-primary" type="submit" id="id_finished" value="Finished"/>
                    </div>
                </div>
            </form>
        {% else %}
            <form id="add_finding" class="form-horizontal" action="{% url 'add_findings' tid %}" method="post">
                {% csrf_token %}
                {% include "dojo/form_fields.html" with form=form %}
                {% block additional_forms %}
                {% endblock additional_forms %}
                {% if jform %}
                    <h4> JIRA </h4>
                    <hr>
                    <div class="form-group">
                        <label class="col-sm-2 control-label" for="id_jira_issue">JIRA URL
                            <i class="fa-solid fa-circle-question has-popover" data-trigger="hover" data-content="JIRA URL connected to this findings product or engagement" data-placement="right" data-container="body" data-original-title="" title="">
                            </i>
                        </label>
                        <div class="col-sm-10 form-control-static">
                            {% if product_tab.product.has_jira_configured %}
                                <a href="{{ product_tab.product|jira_project_url }}"
                                target="_blank"> {{ product_tab.product|jira_project_url }} </a>
                            {% else %}
                            None
                            {% endif %}
                        </div>
                    </div>
                    {% include "dojo/form_fields.html" with form=jform %}
                {% endif %}
                <div class="form-group">
                    <div class="col-sm-offset-2 col-sm-10">
                        <input class="btn btn-primary" type="submit" value="Add Another Finding"/>
                        <input class="btn btn-primary" name="_Finished" type="submit" value="Finished"/>
                    </div>
                </div>
            </form>
        {% endif %}
    </div>
{% endblock %}
{% block postscript %}
    {{ block.super }}
    <script type="application/javascript" src="{% static "jquery.hotkeys/jquery.hotkeys.js" %}"></script>
    <script type="application/javascript" src="{% static "easymde/dist/easymde.min.js" %}"></script>
    <script type="text/javascript" src="{% static "admin/js/jquery.init.js" %}"></script>
    <script type="application/javascript" src="{% static "admin/js/admin/RelatedObjectLookups.js" %}"></script>

    <script type="application/javascript">
        $ = django.jQuery;
        $.hotkeys.options.filterInputAcceptingElements = false;
        $.hotkeys.options.filterTextInputs = false;

        $(document).bind('keydown', 'ctrl+s', function (event) {
            if (event.preventDefault) {
                event.preventDefault();
            } else {
                // internet explorer
                event.returnValue = false;
            }
            {% if temp %}
                $("form#add_finding").submit();
            {% else %}
                $("input[name='_Finished']").trigger('click');
            {% endif %}
        });

        $("textarea").each(function (index, elem) {
            if (elem.hasAttribute("required")) {
                elem.removeAttribute("required");
                elem.id = "req"
            }

            if (elem.name != 'endpoints_to_add' && elem.name != 'vulnerability_ids' && !$(elem).hasClass('select2-search__field')) {
                var mde = new EasyMDE({
                    spellChecker: false,
                    inputStyle: "contenteditable",
                    element: elem,
                    autofocus: false,
                    forceSync: true,
                    toolbar: ["bold", "italic", "heading", "|",
                        "quote", "unordered-list", "ordered-list", "|",
                        "link", "image", "|",
                        "table", "horizontal-rule", "code", "|",
                        "guide"
                    ]
                });
                mde.render();
            }
        });

        $("#add_finding").submit(function () {
            var isFormValid = true;

            $("textarea#req").each(function () {
                if ($.trim($(this).val()).length == 0) {
                    $(this).addClass("highlight");
                    isFormValid = false;
                }
                else {
                    $(this).removeClass("highlight");
                }
            });

            if (!isFormValid) alert("Please fill in all the required fields (indicated by *)");

            return isFormValid;
        });
    </script>
{% endblock %}
